How to Change the Favicon for a Web Application

Description

How to add and display a Favicon in a web project.

Discussion

The icon in the top left corner of a web page is called the Favicon, short for favorites icon. You can supply your own custom Favicon for your web applictaions in Alpha Anywhere by adding a favicon.ico file to the webroot of your Alpha Anywhere web project.

Adding the Favicon to a Web Project

By default, the Favicon is found on a web site in the root directory at ./favicon.ico. The web browser will look for the <link rel="icon" > entry in the <head> section of a web page that specifies that a Favicon should be displayed. EG:

<head>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
</head>

If no <link rel="icon" > entry exists, the web browser will search for the Favicon file in the host root directory.

To use your own icon, create a favicon.ico icon and place it in the webroot of your Alpha Anywhere project (directly inside the WebProjects folder for your Project). When your application is published to the Application Server, including IIS and Alpha Cloud, the new Favicon will be used.

If you want to specify more than one favicon for your application, specify it using <link rel="icon" > in the <head> portion of your web page.

Disabling the Default Favicon for Apps Running on the Classic Application Server

If you are using the stand-alone Alpha Anywhere Application Server, Alpha Anywhere will supply a favicon for you if you do not create one. If you don't want to display either your icon or the Alpha Anywhere favicon, you can disable this functionality in the Application Server Control Panel on the Advanced tab in the Built-in Resources section. Uncheck the Alpha Software Favicon property and restart the application server.

images/defaultFavicon.png

I published my new Favicon to the webroot, but it doesn't appear in the title bar.

Favicon.ico is cached very aggressively by web browsers. Because of this, your new Favicon may not appear after you publish your application. You can force your browser to reload the Favicon by trying one or all of the following:

  • Clear your browser cache.
  • Load the Favicon in the webrowser by navigating to http://<your server>/favicon.ico or https://<your server>/favicon.ico if you have enabled TLS/SSL on your server.

It may also be necessary to restart the browser if the icon shown in the address bar still has not updated.

Limitations

Web Applications Only